<!DOCTYPE HTML>
<html>
<head>
    <title>拼团管理</title>
    <link rel="stylesheet" href="/stylesheets/style.css">
    <script src="/scripts/jquery.min.js"></script>
    <script src="/scripts/boot.js" type="text/javascript"></script>
    <link rel="stylesheet" href="/scripts/miniui/themes/default/miniui.css">
    <link rel="stylesheet" href="/scripts/miniui/themes/icons.css">
    <link rel="stylesheet" href="/scripts/miniui/themes/bootstrap/skin.css">
    <link rel="stylesheet" href="/editor/common.css">
    <script src="/scripts/miniui/miniui.js"></script>
</head>
<body  style="padding: 0;width: 100%;height: 97%">
<div style="width:99%;height: 97%;">
    <div id="outImg">
        <img id="imgId" src="" alt="" onclick="smallImg()">
    </div>
    <div style="width:99%;">
        <div style="padding: 5px">
            <span>团单id：</span><input  class="mini-textbox" type="text" id="groupId" />
            <span>发起拼团时间：</span>
            <input id="groupLaunchTimeFrom" class="mini-datepicker" style="width:200px;" onvaluechanged="onValueChanged"
                   format="yyyy-MM-dd H:mm:ss" timeFormat="H:mm:ss" showTime="true" showOkButton="true" showClearButton="false" required="true" value=""/>
            <span>-</span>
            <input id="groupLaunchTimeTo" class="mini-datepicker" style="width:200px;" onvaluechanged="onValueChanged"
                   format="yyyy-MM-dd H:mm:ss" timeFormat="H:mm:ss" showTime="true" showOkButton="true" showClearButton="false" required="true" value=""/>

            <span>拼团状态：</span><input id="groupStatus" class="mini-combobox"  data="groupStatus" />
            <a class="mini-button" iconCls="icon-search" onclick="searchGroup()">查找</a>
        </div>
    </div>
    <div id="datagrid1" class="mini-datagrid" style="width:99%;height: 63%;"
         url="/getdata/groupSearch" idField="id" allowResize="true" onselectionchanged="onSelectedChanged"
         sizeList="[20,30,50,100]" pageSize="20">
        <div property="columns">
            <div type="checkcolumn" width="20" ></div>
            <div field="objectId" width="80" headerAlign="center" align="center" allowSort="true" >团单Id</div>
            <div field="goodsOId" width="80" headerAlign="center" align="center" allowSort="true" >商品Id</div>
            <div field="goodsName" width="80" headerAlign="center" align="center" allowSort="true" >商品名称</div>
            <div field="createdAt" width="80" renderer="onBirthdayRenderer"  headerAlign="center" align="center" allowSort="true" >发起拼团时间</div>
            <div field="duration" width="50" headerAlign="center" align="center" >拼团有效时长</div>
            <div field="groupPeopleNum" width="50" headerAlign="center" align="center" >成团人数</div>
            <div field="participantsNum" width="50" headerAlign="center" align="center" >已参团人数</div>
            <div field="status" width="50" renderer="groupStatusRenderer" headerAlign="center" align="center" >拼团状态</div>
        </div>
    </div>

    <h2>同团订单</h2>
    <div style="padding: 5px">
        <span>买家ID：</span><input  class="mini-textbox" type="text" id="buyerOId"/>
        <span>收货人：</span><input  class="mini-textbox" type="text" id="receiver"/>
        <span>订单号：</span><input  class="mini-textbox" type="text" id="orderCode"/>
        <span>买家昵称：</span><input  class="mini-textbox" type="text" id="buyerUser"/>
        <span>订单状态：</span><input id="status" class="mini-combobox"  data="orderStatus" />
        <a class="mini-button" iconCls="icon-search" onclick="search()">查找</a>
    </div>
    <div style="width:99%;">
        <div class="mini-toolbar" style="border-bottom:0;padding:0;">
            <table style="width:100%;">
                <tr>
                    <td style="width:100%;">
                        <a id="refund" style="display: none" class="mini-button" iconCls="icon-add" onclick="shopMangerEdit()">编辑</a>
                        <a id="receipt" style="display: none" class="mini-button" iconCls="icon-add" onclick="receipt()">确认收货</a>
                        <a id="sendGoods" style="display: none" class="mini-button" iconCls="icon-add" onclick="send()">发货</a>
                    </td>
                </tr>
            </table>
        </div>
    </div>

    <div id="datagrid2" class="mini-datagrid" style="width:99%;height: 82%;"
         url="/getdata/sameGroupOrder" idField="id" allowResize="true"
         sizeList="[20,30,50,100]" pageSize="20"
         onshowrowdetail="onShowRowDetail">
        <div property="columns">
            <div type="expandcolumn" >#</div>
            <div field="objectId" width="80" allowSort="true"  align="center" headerAlign="center">订单id</div>
            <div field="status" width="80" allowSort="true" renderer="statusRenderer" align="center" headerAlign="center">订单状态</div>
            <div field="goodsPicURL" width="50" allowSort="true"  align="center" headerAlign="center">商品图片</div>
            <div field="goodsOId" width="80" allowSort="true" renderer="picRenderer" align="center" headerAlign="center">商品详情</div>
            <div field="orderCode" width="100" align="center" headerAlign="center" allowSort="true">订单号</div>
            <div field="totalPrice" width="50" align="center" headerAlign="center" allowSort="true">付款金额</div>
            <div field="phone" width="100"  align="center" headerAlign="center" allowSort="true">电话号码</div>
            <div field="shopName" width="100"  align="center" headerAlign="center" allowSort="true">店铺名称</div>
            <div field="shopUserName" width="100"  align="center" headerAlign="center" allowSort="true">店主</div>
            <div field="payType" width="70" align="center" headerAlign="center" renderer="payTypeRenderer" allowSort="true">支付方式</div>
            <div field="receiver" width="100" align="center" headerAlign="center" allowSort="true" >收货人</div>
            <div field="expressCode" width="100" align="center" headerAlign="center" allowSort="true" >快递编号</div>
            <div field="logisticsCom" width="100" align="center" headerAlign="center" allowSort="true" >物流公司</div>
            <div field="deliverTime" width="100" align="center" headerAlign="center" dateFormat="yyyy-MM-dd hh:mm:ss" allowSort="true">发货时间</div>
            <div field="payTime" width="100" align="center" headerAlign="center" dateFormat="yyyy-MM-dd hh:mm:ss" allowSort="true">付款时间</div>
            <div field="createdAt" width="100" align="center" headerAlign="center" dateFormat="yyyy-MM-dd hh:mm:ss" allowSort="true">创建日期</div>
        </div>
    </div>
    <div id="editForm1" style="display:none;">
        <div  class="mini-tabs" style="width:100%;" activeIndex="0">
            <div title="收货人信息">
                <input class="mini-hidden" name="id"/>
                <table style="width:100%;">
                    <tr style="height: 50px">
                        <td style="width: 80px;">买家：</td>
                        <td style="width:150px;"><div id="buyerId" /></td>
                        <td style="width:80px;">收货人：</td>
                        <td style="width:150px;"><div id="receiver"  /></td>
                        <td style="width:80px;">昵称：</td>
                        <td style="width:150px;"><div id="buyerName" /></td>
                        <td style="width: 80px;">收货地址：</td>
                        <td style="width: 300px"><div id="address" style="width: 300px" /></td>
                    </tr>
                    <tr style="height: 50px" >
                        <td style="width:150px; display: none"><input name="objectId" class="mini-textbox" /></td>
                    </tr>

                </table>
            </div>
            <div title="商品信息">
                <input class="mini-hidden" name="goods"/>
                <table style="width:100%;">
                    <tr style="height: 50px">
                        <td style="width:80px;">购买数量：</td>
                        <td style="width:150px;"><div id="num" ></div></td>
                        <td style="width:80px;">购买规格：</td>
                        <td style="width:150px;"><div id="goodsModel" /></td>
                        <td style="width: 80px;">商品价格：</td>
                        <td style="width: 150px"><div id="price" /></td>
                        <td style="width: 80px;">商品名称：</td>
                        <td style="width:80px;"><div id="goodsName"  style="width: 300px"/></td>
                    </tr>
                    <tr style="height: 50px" >
                        <td style="width:80px;">团购价格：</td>
                        <td><div id="groupPrice"/></td>
                        <td style="width:80px;">物流信息：</td>
                        <td><div   id="context"  ></div></td>
                        <td style="width:150px; display: none"><input name="" class="mini-textbox"/></td>
                    </tr>

                </table>

            </div>
        </div>
    </div>
</div>


</div>
</body>
<script type="text/javascript">
    var groupStatus = [{ id: 100, text: '全部' }, { id: 0, text: '拼团中'},{ id: 1, text: '拼团成功'}, {id:-1,text: '拼团失败'}];
    var orderStatus = [{ id: 100, text: '全部' }, { id: 1, text: '未付款'},{ id: 2, text: '待发货'}, {id:3,text: '待收货'},
        {id:4,text: '已收货'}, {id:5,text: '订单结束'},{ id: 0, text: '取消的订单' }, {id:-1,text: '卖家同意退款'}, {id:-2,text: '退款成功'}, {id:-3,text: '买家申请退款'}];

    var editForm = document.getElementById("editForm1");

    var flag = 1;
    mini.parse();
    var grid = mini.get("datagrid1");
    var grid2 = mini.get("datagrid2");
    grid.load();
    grid.on("drawcell", function (e) {
        var value = e.value;
        var column = e.column;
        if (column.field == "shopIcon") {
            if(value) {
                e.cellHtml = '<img class="bigImg" onclick="bigImg()" src="' + value + '?imageMogr2/thumbnail/640x/format/jpg/interlace/1/auto-orient" width="30" height="30" alt="图片">';
            }else{
                e.cellHtml = '<img class="bigImg" onclick="bigImg()"  src="http://7xiuo5.com1.z0.glb.clouddn.com/fgImage.png?imageMogr2/auto-orient/thumbnail/!100x100r/gravity/Center/crop/100x100/quality/80/auto-orient" width="30" height="30" alt="图片">';
            }
        }
    });
    grid2.on("drawcell", function (e) {
        var  value = e.value;
        column = e.column;
        //将性别文本替换成图片
        if (column.field == "goodsPicURL") {
            if(value) {
                e.cellHtml = '<img class="bigImg" onclick="bigImg2()" src="' + value + '?imageMogr2/thumbnail/640x/format/jpg/interlace/1/auto" width="30" height="30" alt="图片">';
            }else{
                e.cellHtml = '<img class="bigImg" onclick="bigImg2()"  src="http://7xiuo5.com1.z0.glb.clouddn.com/fgImage.png?imageMogr2/auto-orient/thumbnail/!100x100r/gravity/Center/crop/100x100/quality/80/auto-orient" width="30" height="30" alt="图片">';
            }
        }
    });
    function bigImg() {
        var row = grid.getSelected();
        if (row) {
            if(flag==1) {
                var path = row.shopIcon;
                $("#imgId").attr('src', path);
                $("#outImg").css('display','block');
            }
        }
    }
    function smallImg() {
        $("#outImg").css('display','none');
    }


    function bigImg2() {
        var row = grid.getSelected();
        if (row) {
            var path = row.goodsPicURL;
            $("#imgId").attr('src', path);
            $("#outImg").css('display','block');
        }
    }
    function smallImg2() {
        $("#outImg").css('display','none');
    }
    function onBirthdayRenderer(e) {
        var value = e.value;
        if (value) return mini.formatDate(value, 'yyyy-MM-dd hh:mm:ss');
        return "";
    }

    function onSelectedChanged(e) {
        var tribeGrid = e.sender;
//    tribeGrid.setStyle('height: 52%;');
//    grid2.setStyle('height: 47%;');
        var record = tribeGrid.getSelected();
        if (record) {
            grid2.load({groupOId:record.objectId});
        }
    }

    function searchGroup() {
        var groupId = mini.get("groupId").getValue();
        var groupLaunchTimeFrom = mini.get("groupLaunchTimeFrom").getValue();
        var groupLaunchTimeTo = mini.get("groupLaunchTimeTo").getValue();
        var groupStatus = mini.get("groupStatus").getValue();
        console.log("searchGroup-->"+groupStatus)
        grid.load({
            groupId: groupId,
            groupLaunchTimeFrom:groupLaunchTimeFrom,
            groupLaunchTimeTo:groupLaunchTimeTo,
            groupStatus:groupStatus,
        });

    }
    function bigImg() {
        var row = grid.getSelected();
        if (row) {
            if(flag==1) {
                var path = row.shopIcon;
                $("#imgId").attr('src', path);
                $("#outImg").css('display','block');
            }
        }
    }
    function statusRenderer(e) {
        var value = e.value;
        if (value==-3) {
            return (value, '买家申请退款')
        }else if(value==-2){
            return (value, '退款成功')
        }else if(value==-1){
            return (value,'卖家同意退款')
        }else if(value==0){
            return (value,'取消的订单')
        }else if(value==1){
            return (value,'未付款')
        }else if(value==2){
            return (value,'待发货')
        }else if(value==3){
            return (value,'待收货')
        }else if(value==4){
            return (value,'已收货')
        }else if(value==5){
            return (value,'订单结束')
        }
    };

    function groupStatusRenderer(e){
        var value = e.value;
        if (value==0) {
            return (value, '拼团中')
        }else if(value==1){
            return (value, '拼团成功')
        }else if(value==2){
            return (value,'拼团失败')
        }
    }
    function payTypeRenderer(e) {
        var value = e.value;
        if (value==1) {
            return (value, '支付宝')
        }else if(value==2){
            return (value, '微信')
        }else{
            return (value, '无')
        }
    }
    function picRenderer(e) {
        var value = e.value;
        if (value.status=='app') {
            return (value, '<a href="http://health.aladada.com/goods/info?id=' + value.objectId + '" target="view_window">App商品</a>')
        }else if(value.status=='group'){
            return (value, '<a href="http://health.aladada.com/groups/groupBuying?fgOId=' + value.objectId + '" target="view_window">团购商品</a>')
        }else{
            return (value,'<span>无商品</span>')
        }
    }

    function onShowRowDetail(e) {
        var row = e.record;

        //将editForm元素，加入行详细单元格内
        var td = grid2.getRowDetailCellEl(row);
        td.appendChild(editForm);
        editForm.style.display = "";

        //表单信息
        var form = new mini.Form("editForm1");
        if (grid2.isNewRow(row)) {
            form.reset();
        } else {
            grid2.loading();
            $.ajax({
                url: "/getdata/shopOrderInfo?objectId=" + row.objectId,
                success: function (text) {
                    $("#context").empty();
                    var o = mini.decode(text);
                    var log = o.logObj;
                    form.setData(o.result.data[0]);
                    let data=o.result.data[0];
                    $("#buyerId").empty();
                    $("#receiver").empty();
                    $("#buyerName").empty();
                    $("#address").empty();

                    $("#num").empty();
                    $("#goodsModel").empty();
                    $("#price").empty();
                    $("#goodsName").empty();
                    $("#groupPrice").empty();

                    $("#buyerId").append('<p style="width: 100px">'+data.buyerId+'</p>');
                    $("#receiver").append('<p style="width: 100px">'+data.receiver+'</p>');
                    $("#buyerName").append('<p style="width: 100px">'+data.buyerName+'</p>');
                    $("#address").append('<p style="width: 300px">'+data.address+'</p>');

                    $("#num").append('<p style="width: 100px">'+data.num+'</p>');
                    $("#goodsModel").append('<p style="width: 100px;">'+data.goodsModel+'</p>');
                    $("#price").append('<p style="width: 100px;">'+data.price+'</p>');
                    $("#goodsName").append('<p style="width: 100px;">'+data.goodsName+'</p>');
                    $("#groupPrice").append('<p style="width: 100px;">'+data.groupPrice+'</p>');

                    if(log.data==''){
                        $("#context").append('<span>无物流信息</span>');
                    }else {
                        var logLen = log.data.length;
                        for (var i=logLen-1;i>=0;i--){
                            $("#context").append('<p style="width: 600px;margin-top: 10px">'+log.data[i].context+log.data[i].time+'</p>');
                        }
                    }

                    grid2.unmask();
                }
            });
        }
    }

</script>
</html>
